<template>
    <!-- 支付成功没取货的时候是 待取货 取货码,导航 等信息  222  -->
    <div class="status2">
        <div class="forPickup dd-column dd-h-center" >
            <div class='takeFood dd-mgt20  dd-mgb10'>取餐码</div>
            <div class='takeFoodCode dd-mgb10'>{{detailsData.pickUpCode}}</div>
            <div class='takeFoodTip  dd-mgb10 '>24小时未取餐将自动退款到原支付账号</div>
            <div class='dd-column dd-h-center  dd-mgt20'>
                <div class='dd-row dd-h-center  dd-mgb20'>
                    <div class='dd-btn-yellow-c' @click='saoMa'>扫码取餐</div>
                </div>
                <div class='dd-row dd-h-center  dd-mgb20'>
                    <div class='dd-btn-default' @click='gotoNavigator'>导航</div>
                </div>
                <div class='dd-row dd-h-center  dd-mgb20'>
                    <!-- <div class='dd-btn-red-c' @click='replace'>代取餐</div> -->
                </div>
            </div>
            <div class=' dd-fixed-bottom'>
                <div class='dd-row dd-h-center'>
                    <div @click="gotoQuestion">取餐故障</div>
                    <div class='divider'>|</div>
                    <div @click='toApplyForARefund'>申请退款</div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
  props: ["detailsData"],
  methods: {
    saoMa() {
      console.log("saoMa");
      // 调取扫码接口

    },

    // 进行导航
    gotoNavigator() {
      console.log("gotoNavigator");
    },
    // 申请退款
    toApplyForARefund() {
      console.log("toApplyForARefund");
    }
    ,
    // gotoQuestion  取餐故障
    gotoQuestion(){
      this.$router.push('/question')
    }
  }
};
</script>
<style scoped>
/* 已付款 没取货时候的取货码  */

/* 分割线  */
.forPickup {
}
/* 取餐码 三个字  */
.forPickup .takeFood {
  font-size: 10pt;
}
/* 取餐码 数字  */
.forPickup .takeFoodCode {
  font-size: 14pt;
  font-weight: bold;
}
/* 超时提示  */
.forPickup .takeFoodTip {
  font-size: 8pt;
  color: #444;
}
/* 底部  */
.forPickup .dd-fixed-bottom {
  font-size: 10pt;
  font-weight: normal;
  bottom: 10pt;
  color: #444;
}
/* 底部分割线  */
.forPickup .dd-fixed-bottom .divider {
  margin: 0 5pt;
}
</style>
